<div class="page registrar-maquina-ejercicio">

    <div class="row ui-section">
        <div class="col-lg-8 clearfix">
            <h2 class="section-header"><span data-translate="REGISTER_MACHINE_TITLE"></span></h2>
        </div>

        <div class="col-md-12">
            <section class="panel panel-default">
                <div class="panel-body padding-xl">
                    <div class="row">
                        <div class="col-md-8 col-md-offset-2">

                            <form data-ng-controller="registrarMaquinaCtrl" ng-init="getMaquinaInfo()" role="form" name="frmRegistrarMaquina" ng-submit="guardarInfo()">
                                <div class="form-group">
                                    <md-input-container>
                                        <label for="nombreMaquina">Nombre</label>
                                        <input md-maxlength="80" required name="nombreMaquina" ng-model="maquina.nombreMaquina">
                                        <div ng-messages="frmRegistrarMaquina.nombreMaquina.$error">
                                            <div ng-message="required"><span data-translate="GENERIC_FORM_ERROR_REQUIRED"></span></div>
                                            <div ng-message="md-maxlength"><span data-translate="GENERIC_FORM_ERROR_TOO_LONG"></span></div>
                                        </div>
                                    </md-input-container>
                                </div>

                                <div class="form-group">
                                    <md-input-container>
                                        <label for="numeroSerie">N&uacute;mero Serie</label>
                                        <input md-maxlength="20" required name="numeroSerie" ng-model="maquina.numeroSerie">
                                        <div ng-messages="frmRegistrarMaquina.numeroSerie.$error">
                                            <div ng-message="required"><span data-translate="GENERIC_FORM_ERROR_REQUIRED"></span></div>
                                            <div ng-message="md-maxlength"><span data-translate="GENERIC_FORM_ERROR_TOO_LONG"></span></div>
                                        </div>
                                    </md-input-container>
                                </div>

                                <div class="form-group">
                                    <md-input-container>
                                        <label for="numeroMaquina">N&uacute;mero M&aacute;quina</label>
                                        <input md-maxlength="20" required name="numeroMaquina" ng-model="maquina.numeroMaquina" ng-pattern="/^\d+$/">
                                        <div ng-messages="frmRegistrarMaquina.numeroMaquina.$error">
                                            <div ng-message="required"><span data-translate="GENERIC_FORM_ERROR_REQUIRED"></span></div>
                                            <div ng-message="md-maxlength"><span data-translate="GENERIC_FORM_ERROR_TOO_LONG"></span></div>
                                        </div>
                                    </md-input-container>
                                </div>

                                <div class="form-group">
                                    <md-input-container>
                                        <label for="indicacionesUso">Indicaciones de Uso</label>
                                        <input md-maxlength="200" required name="indicacionesUso" ng-model="maquina.indicacionesUso">
                                        <div ng-messages="frmRegistrarMaquina.indicacionesUso.$error">
                                            <div ng-message="required"><span data-translate="GENERIC_FORM_ERROR_REQUIRED"></span></div>
                                            <div ng-message="md-maxlength"><span data-translate="GENERIC_FORM_ERROR_TOO_LONG"></span></div>
                                        </div>
                                    </md-input-container>
                                </div>

                                <div class="form-group">
                                    <md-select required ng-model="maquina.idTipoMaquina" placeholder="Tipos de M&aacute;quina" >
                                        <md-option data-ng-repeat="tipoMaquina in tiposMaquinas" value="{{tipoMaquina.Id}}">{{tipoMaquina.Descripcion}}</md-option>
                                    </md-select>
                                </div>

                                <div class="form-group">
                                    <label for="indicacionesUso">Im&aacute;gen del ejercicio</label>
                                     <input type="file" ng-file-select="onFileSelect($files)" >
                                     <img class="previewImage" ng-src="{{maquina.fotoMaquina}}"/>
                                </div>

                                <div class="form-group">
                                    <md-button href="#/maquinas/listar">
                                        <span data-translate="FORMS_BACK_CTA"></span>
                                    </md-button><span class="space"></span>
                                    <md-button class="md-raised md-primary" type="submit">
                                        <span data-translate="FORMS_SAVE_CTA"></span>
                                    </md-button>
                                </div>
                            </form>

                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>

</div>